/* 新手引导页面样式 */
#maskIn1{
    position: absolute;
    top:0;
    left:0;
    width:100%;
    height:100%;
    background: none;
    z-index:501;
    background: url(../images/new_bg1.png);
    background-size: 100% 100%;
}
#maskIn2{
    position: absolute;
    top:0;
    left:0;
    width:100%;
    height:100%;
    background: none;
    z-index:501;
    background: url(../images/new_bg2.png);
    background-size: 100% 100%;
}
#maskIn3{
    position: absolute;
    top:0;
    left:0;
    width:100%;
    height:100%;
    background: none;
    z-index:501;
    background: url(../images/new_bg3.png);
    background-size: 100% 100%;
}
#maskIn4{
    position: absolute;
    top:0;
    left:0;
    width:100%;
    height:100%;
    background: none;
    z-index:501;
    background: url(../images/new_bg_4.png);
    background-size: 100% 100%;
}
#maskIn5{
    position: absolute;
    top:0;
    left:0;
    width:100%;
    background: none;
    z-index:501;}
.mask_guan{
    display: block;
    position: absolute;
    right:5%;
    top:4%;
    color: white;
    font-size:0.875rem;}
.mask_first{
    width:88%;
    margin:0 auto;
    position: relative;
    border:1px dashed #828282;
    -webkit-border-radius:1rem;
    -moz-border-radius:1rem;
    border-radius:1rem;
    margin-top:70%;
    padding:1% 0;}
.mask_first *{
    margin:0;
    text-align: center;}
.mask_first h1{
    margin-bottom:2%;
    font-size:1.375rem;
    color: #fff;}
.mask_first p{
    font-size:1rem;
    line-height:1.5rem;
    color: #A8A8A8;}
.mask_first4{
    width: 88%;
    margin: 0 auto;
    position: relative;
    border: 1px dashed #828282;
    -webkit-border-radius: 1rem;
    -moz-border-radius: 1rem;
    border-radius: 1rem;
    /* margin-top: 107%; */
    padding: 2% 0;
    top: 35%;
    position: absolute;
    transform: translateX(-50%);
    left: 50%;
    text-align: center;
}


.mask_first4 *{
    margin:0;
    text-align: center;}
.mask_first4 h1{
    margin-bottom:2%;
    font-size:1.375rem;
    color: #fff;}
.mask_first4 p{
    font-size:1rem;
    line-height:1.5rem;
    color: #A8A8A8;}
.mask_first1{
     width: 55%;
    margin: 0 auto;
    /* position: relative; */
    border: 1px dashed #828282;
    -webkit-border-radius: 1rem;
    -moz-border-radius: 1rem;
    border-radius: 1rem;
    margin-top: 110%;
    padding: 1% 0;
    margin-left: 10%;
    position: absolute;
    bottom: 20%;
}


.mask_first1 *{
    margin:0;
    text-align: center;}
.mask_first1 h1{
    margin-bottom:2%;
    font-size:1.375rem;
    color: #fff;}
.mask_first1 p{
    font-size:1rem;
    line-height:1.5rem;
    color: #A8A8A8;}

.mask_first3{
    width: 88%;
    margin: 0 auto;
    position: relative;
    border: 1px dashed #828282;
    -webkit-border-radius: 1rem;
    -moz-border-radius: 1rem;
    border-radius: 1rem;
    /* margin-top: 107%; */
    padding: 1% 0;
    top: 46%;
    position: absolute;
    transform: translateX(-50%);
    left: 50%;
    text-align: center;
}
.mask_first3 *{
    margin:0;
    text-align: center;}
.mask_first3 h1{
    margin-bottom:2%;
    font-size:1.375rem;
    color: #fff;}
.mask_first3 p{
    font-size:1rem;
    line-height:1.5rem;
    color: #A8A8A8;}
.mask_hand{
    width: 3.1%;
    padding:13.8%;
    position: absolute;
    left:0;
    top:-40%;
    background: url("../images/head.png") no-repeat center;
    -webkit-background-size:50%;
    background-size:50%;}
.pic_novice1{
    display: block;
    margin:1% auto 0;
    // width:31.2%;
    height: 160px;
}
#maskIn1>p{
    width:76.7%;
    margin:0 auto;
    text-align: center;
    color: #FBDA30;
    font-size:0.875rem;
    line-height:1.75rem;}
.mask_next{
    position: relative;
    width:33.33%;
    display: block;
    padding-top:15.8%;
    border:0;
    margin:0 auto;
    background: url("../images/next.png") no-repeat center;
    -webkit-background-size:100%;
    background-size:100%;}
.mask_next span{
    color: #fff;
    position: absolute;
    top:30%;
    left:0;
    width:100%;
    display: block;
    text-align: center;
    font-size:0.875rem;
    line-height:1.75rem;}
.mask_second{
    margin-top:30%;}

.mask_hand1{
    padding: 6.8%;
    position: absolute;
    right: 6%;
    bottom: 4%;
    background: url(../images/head.png) no-repeat center;
    -webkit-background-size: 50%;
    background-size: 50%;
    /* margin-right: 1px; */
}
.mask_hand2{
    padding: 6.8%;
    position: absolute;
    right: 10%;
    top: 21%;
    background: url(../images/head.png) no-repeat center;
    -webkit-background-size: 50%;
    background-size: 50%;
    /* margin-right: 1px; */
}
.mask_hand3{
    padding: 6.8%;
    position: absolute;
    right: 10%;
    top: 32%;
    background: url(../images/head.png) no-repeat center;
    -webkit-background-size: 50%;
    background-size: 50%;
    /* margin-right: 1px; */
}


/*.slide_o{
    margin-top:35%;
    position: relative;}
.slide_o li{
    position: absolute;}

.slide_o li:nth-of-type(3){
    right:10%;
    top:0;
    width:21.73%;
    padding-top:9.3%;
    background: url("../../images/novice/right.png") no-repeat center;
    -webkit-background-size:100%;
    background-size:100%;}

.slide_o .mask_hand{
    position: static;
    margin:0 auto;}*/


.pic_novice2{
    margin:0 auto;
    margin-top:10%;
}
.mask_true{
    background: url("../images/true.png") no-repeat center;
    -webkit-background-size:100%;
    background-size:100%;}
.mask_true span{
    color: #A8A8A8;}
.mask_third{
    // margin-top:84%;
}
.pic_novice3{
    margin-top:15%;}
.pic_novice4{
    position: absolute;
    right: 2%;
    bottom: 20%;
}
.mask_fourth{
    overflow: hidden;
}
.mask_fourth h1{
    /* float: left; */
    /* margin-left: 5%; */
    line-height: 3rem;
    /* margin-bottom: 0; */
    /* margin: 0 auto; */
}
.mask_fourth p{
 }

#novice{
    font-size:0.7125rem;
    display: block;
    width:0.85rem;
    height: 0.85rem;
    line-height:0.85rem;
    text-align: center;
    position: absolute;
    right:1%;
    top:0.3%;
    color: #333;
    background: #999;
    -webkit-border-radius:50%;
    -moz-border-radius:50%;
    border-radius:50%;}
